import React from 'react';
import {render} from 'react-dom';

//子组件
class Todo extends React.Component{
	constructor(props){
		super(props);
		this.addTodo=this.addTodo.bind(this);
		this.removeTodo=this.removeTodo.bind(this);
	}

	addTodo(){
		//操作追加，方法得去用TodoController传给我的属性
		var text=this.refs.text.value;
		this.props.onClick(text);
	}

	removeTodo(index){
		this.props.removeTodo(index);
	}

	render(){
		var that=this;
		var todolist=this.props.list.map(function(item,index){
			return(
				<li key={index}>
					{item}
					<button onClick={that.removeTodo.bind(that,index)}>删除</button>
				</li>
			)
		})
		return(
			<div>
				<input type="text" ref='text'/>
				<button onClick={this.addTodo}>添加</button>
				<ul>
					{todolist}
				</ul>
			</div>
		)
	}
}

export default Todo;